Lifecycle Methods
Catalyst provides several methods to handle different stages of the SSR lifecycle, allowing for more fine grain control over the flow
Lifecycle Benefits
🔧 Fine Control
Handle specific stages of the SSR process with precision
🐛 Error Handling
Comprehensive error handling at each lifecycle stage
📊 Monitoring
Track and monitor application performance and errors
Lifecycle Methods Demo
This demo shows Catalyst's SSR lifecycle methods and their execution order. Click the buttons below to simulate different lifecycle scenarios.
Lifecycle Flow
preServerInit
Before server starts
onRouteMatch
After route matching
onFetcherSuccess
After data fetching
Render
Component rendering
Events Log
No events logged yet. Click a button above to simulate lifecycle.
Watch the events appear in real-time as the lifecycle progresses.
Code Example
Server Lifecycle Methods (server/index.js)
// server/index.js export const preServerInit = () => { console.log('Server initialization started'); // Initialize server configurations // Set up middleware // Configure logging } export const onServerError = (error) => { console.error('Server error:', error); // Handle server startup failures // Log critical errors // Send notifications } export const onRouteMatch = (route) => { console.log('Route matched:', route); // Handle route matching logic // Set up route-specific middleware // Validate route parameters } export const onFetcherSuccess = (data) => { console.log('Data fetched successfully:', data); // Process fetched data // Transform data for rendering // Cache results } export const onRenderError = (error) => { console.error('Render error:', error); // Handle component rendering errors // Fallback to error page // Log rendering issues } export const onRequestError = (error) => { console.error('Request error:', error); // Handle request-level errors // Return appropriate error responses // Log request failures }
Lifecycle Functions
Catalyst provides the following lifecycle methods that can be defined in and exported from server/index.js
:
preServerInit
- Triggers before starting the server.onServerError
- Triggered if the SSR server fails to start or encounters a critical error. Useful for handling server initialization issues.onRouteMatch
- Called after route matching attempts, regardless of whether a match was found or not. This method enables you to handle both successful and failed route matchesonFetcherSuccess
- Triggered after running a container's serverFetcher (currently running for both success and failure case)onRenderError
- Executes when the rendering process encounters an error. This allows you to handle any failures during component rendering.onRequestError
- Executes if any error occurs while handling the document request (think of it like the outer most catch block)